<style scoped lang="scss">
.admin_page {
  background-size: 100% 100%;
  background-image: url("~assets/img/admin/admin.login.bg.png");
}

.main {
  border-radius: 20px;
  width: 870px;
  margin: 100px auto auto;
  padding: 20px;
  background-color: white;
}

img {
  height: 400px;
}
</style>
<template>
  <div class="admin_page">
    <div class="main flex aic">
      <img src="~assets/img/admin/1.png" class="flex0 mr50" alt="" />
      <div class="flex1">
        <h3 class="mb20 fs24 flex">后台管理</h3>
        <el-form ref="form" :model="form" label-width="0px">
          <el-form-item>
            <el-input
              v-model="form.name"
              placeholder="请输入账号"
              prefix-icon="el-icon-phone-outline"
            ></el-input>
          </el-form-item>
          <el-form-item>
            <el-input
              v-model="form.pass"
              show-password
              placeholder="请输入密码"
              prefix-icon="el-icon-user"
            ></el-input>
          </el-form-item>
          <el-form-item>
            <el-button
              type="primary"
              :loading="appLoading"
              style="width: 100%"
              @click="sub"
              >登录
            </el-button>
          </el-form-item>
        </el-form>
      </div>
    </div>
  </div>
</template>

<script>
import { mapMutations } from "vuex";
import { AppLoadingMixin } from "../../lib/mixins/app-loading";

export default {
  name: "Login",
  mixins: [AppLoadingMixin],
  data() {
    return {
      form: {}
    };
  },
  computed: {},
  methods: {
    ...mapMutations({
      setToken: "admin/setToken",
      setLoginInfo: "admin/setLoginInfo"
    }),
    async sub() {
      let { form } = this;
      form = { ...form };
      // eslint-disable-next-line no-undef
      if (form.pass) form.pass = hex_md5(form.pass);
      const { data, token } = await this.$adminService.login(
        form.name,
        form.pass
      );
      if (token) {
        this.setToken(token);
        this.setLoginInfo(data);
        this.$cookies.set("adminToken", token);
        this.$router.push(
          (this.$route.query && this.$route.query.callback) || "/admin"
        );
      } else {
      }
    }
  }
};
</script>
